<template>
  <el-container>
    <el-aside width="200px">
      <el-menu
        active-text-color="#ffd04b"
        background-color="#545c64"
        class="el-menu-vertical-demo"
        default-active="2"
        text-color="#fff">
        <el-menu-item v-for="item in menuList" :key="item.id">
          <span @click="$router.push(item.go)">{{ item.myName }}</span>
        </el-menu-item>
      </el-menu>
    </el-aside>
    <el-main>
      <router-view></router-view>
    </el-main>
  </el-container>
</template>

<script>
export default {
  name: 'AdminHomeMain',
  data() {
    return {
      // menuList: ['用户管理', '宠物管理', '宠物管理', '公告发布', '宠物美容'],
      menuList: [
        { id: 1, myName: '用户管理', go: '/admin/home/userManagement' },
        { id: 2, myName: '宠物管理', go: '/admin/home/petManagement' },
        { id: 3, myName: '订单管理', go: '/admin/home/orderManagement' },
        { id: 4, myName: '公告发布', go: '/admin/home/noticeManagement' },
        { id: 5, myName: '宠物美容', go: '/admin/home/petGroomingManagement' },
      ],
    }
  },
}
</script>

<style lang="less" scoped>
.el-aside {
  .el-menu {
    height: 1130px;
  }
}
</style>
